<template>
  <div>
    <a-modal
      :title="fileType === 'image' ? '图片上传' : '文件上传'"
      :width="width"
      :visible="visible"
      @ok="ok"
      cancelText="取消"
      @cancel="close">
      <!--style="top: 20px;"-->
      <j-upload :file-type="fileType" :value="filePath" @change="handleChange" :disabled="disabled" :number="number"></j-upload>
    </a-modal>
  </div>
</template>

<script>
  import { getFileAccessHttpUrl } from '@/api/manage'

  const getFileName = (path) => {
    if (path.lastIndexOf('\\') >= 0) {
      let reg = new RegExp('\\\\', 'g')
      path = path.replace(reg, '/')
    }
    return path.substring(path.lastIndexOf('/') + 1)
  }

  export default {
    name: 'JFilePop',
    components: { },
    props: {
      title: {
        type: String,
        default: '',
        required: false
      },
      position: {
        type: String,
        default: 'right',
        required: false
      },
      height: {
        type: Number,
        default: 200,
        required: false
      },
      width: {
        type: Number,
        default: 520,
        required: false
      },

      popContainer: {
        type: String,
        default: '',
        required: false
      },
      disabled: {
        type: Boolean,
        default: false,
        required: false
      },
      number: {
        type: Number,
        required: false,
        default: 0
      }
    },
    data() {
      return {
        visible: false,
        filePath: '',
        id: '',
        fileType: 'file'

      }
    },
    methods: {
      handleChange(value) {
        this.filePath = value
      },
      show(id, value, flag) {
        this.id = id
        this.filePath = value
        this.visible = true
        if (flag === 'img') {
          this.fileType = 'image'
        } else {
          this.fileType = 'file'
        }
      },
      ok() {
        if (!this.filePath) {
          this.$message.error('未上传任何文件')
          return false
        }
        let arr = this.filePath.split(',')
        let obj = {
          name: getFileName(arr[0]),
          url: getFileAccessHttpUrl(arr[0]),
          path: this.filePath,
          status: 'done',
          id: this.id
        }
        this.$emit('ok', obj)
        this.visible = false
      },
      close() {
        this.visible = false
      }
    }
  }
</script>

<style scoped>

</style>
